<template>
	<div style="color:dodgerblue;font-weight: bold;font-size: 20px;">通知公告</div>
	<div style="padding: 10px;">
		<!-- 搜索区域 -->
		<el-row style="margin: 10px 0;">
			<el-col :span="16">
				
			</el-col>
			<!-- 搜索区域 -->
			<el-col :span="8">
				<el-input v-model="search" placeholder="请输入关键字" style="width: 75%;" clearable />
				<el-button type="primary" style="margin-left: 10px;">查询</el-button>
			</el-col>
		</el-row>
		<el-table :data="tableData" stripe style="width: 100%" size="large">
			<el-table-column prop="title" label="标题" />
			<el-table-column prop="type" label="类型" />
			<el-table-column prop="date" label="时间" sortable />
		</el-table>
		<div style="margin: 10px 0;">
			 <el-pagination
			   background
			   layout="total, sizes, prev, pager, next, jumper" 
			   v-model:currentPage="currentPage4"
			   :page-size="10"
			   :page-sizes="[5, 10, 20]"
			   @size-change="handleSizeChange"
			   @current-change="handleCurrentChange"
			   :total="total" />
		</div>
	</div>

</template>

<script>
	export default {
		name: "InformOverView",
		data() {
			return {
				currentPage4:1,
				total:10,
				search: '',
				tableData: [{
						title: '五一放假通知',
						type: '通知',
						date: '2022-4-29',
					},
					{
						title: '五一放假通知',
						type: '通知',
						date: '2022-4-29',
					},
					{
						title: '五一放假通知',
					 type: '通知',
						date: '2022-4-29',
					},
					{
						title: '五一放假通知',
						type: '通知',
					 date: '2022-4-29',
					},

				]
			}
		},
		methods:{
			handleSizeChange(){
				
			},
			handleCurrentChange(){
				
			}
			
		}

	}
</script>

<style scoped>

</style>
